import { createApp } from "vue";
import "./style.css";
import App from "./App.vue";
import { createRouter, createWebHistory, createWebHashHistory } from "vue-router";
/** microApp */
import microApp from "@micro-zoe/micro-app";

/**
 * 按照[文档](https://micro-zoe.com/docs/1.x/#/zh-cn/nest)设置tagName
 * 在/src/components/A.vue 中使用 <micro-app-a>
 * 控制台报错 Uncaught TypeError: Illegal constructor
 */
microApp.start({
  iframeSrc: '/admin/empty.html',
  tagName: 'micro-app-a',
});

let app = null
let router = null
let history = null
// 👇 将渲染操作放入 mount 函数，子应用初始化时会自动执行
window.mount = () => {
  router = createRouter({
    history: createWebHistory(window.__MICRO_APP_BASE_ROUTE__ || "/microappA/"),
    routes: [
      {
        path: "/empty",
        name: "empty",
        component: () => import("./components/empty.vue"),
        meta: { hidden: true, title: "中专路由" },
      },
      {
        path: "/a",
        name: "a",
        component: () => import("./components/A.vue"),
        meta: { hidden: true, title: "a" },
      },
      {
        path: "/b",
        name: "b",
        component: () => import("./components/B.vue"),
        meta: { hidden: true, title: "b" },
      },
      {
        path: "/testUrl",
        name: "testUrl",
        component: () => import("./components/testUrl.vue"),
        meta: { hidden: true, title: "testUrl" },
      },
    ],
  });

  app = createApp(App)
  // app.use(ElementPlus)
  // app.use(Antd)
  app.use(router)
  app.mount("#appA")
}

// 👇 将卸载操作放入 unmount 函数
window.unmount = () => {
  app?.unmount()
  history?.destroy()
  app = null
  router = null
  history = null
}

if (!window.__MICRO_APP_ENVIRONMENT__) window.mount();

// console.log('子应用appA的window:', window);
console.log('子应用appA的window.__MICRO_APP_ENVIRONMENT__:', window.__MICRO_APP_ENVIRONMENT__, '判断应用是否在微前端环境中');
console.log('子应用appA的window.__MICRO_APP_NAME__:', window.__MICRO_APP_NAME__, '应用名称');
// console.log('子应用appA的window.__MICRO_APP_PUBLIC_PATH__:', window.__MICRO_APP_PUBLIC_PATH__, '子应用的静态资源前缀');
console.log('子应用appA的window.__MICRO_APP_BASE_ROUTE__:', window.__MICRO_APP_BASE_ROUTE__, '子应用的基础路由');
// console.log('子应用appA的window.__MICRO_APP_BASE_APPLICATION__:', window.__MICRO_APP_BASE_APPLICATION__, '判断应用是否是主应用');